import Link from 'next/link';
import React from 'react';
import ColumnItem from './ColumnItem';
// css
import styles from '@/styles/CommonComponent.module.scss';

class RelateRoute extends React.Component {

    constructor(props) {
        super(props);
    }

    render() {
        const { city, data } = this.props;
        if(!data.length){
            return <></>
        }
        return (
            <section className={styles['destination-relate-wrap']}>
                <h2>
                    {city}旅游线路
                    <Link href={`/line/?city=${city}`}>
                        <a target="_blank">查看更多<span className="iconfont icon-xialajiantouxiao"></span></a>
                    </Link>
                </h2>
                <div className={styles['column']}>
                    {
                        data.map(item => <ColumnItem target={`/line/${item.id}.html`} data={item} key={item.id} />)
                    }
                </div>
            </section>
        )
    }
}

export default RelateRoute